SSM整合

2023-08-14 17:49| 来源: 网络整理| 查看: 265

最近刚学完ssm，我从maven工程建完开始整合ssm并完成基于layui数据表格的增删改查，记录一下。

第一步导入坐标 pom.xml

导入我们需要的坐标，包括spring、servlet、mysql、日志等。

org.springframework spring-context 5.0.5.RELEASE org.aspectj aspectjweaver 1.8.7 org.springframework spring-jdbc 5.0.5.RELEASE org.springframework spring-tx 5.0.5.RELEASE org.springframework spring-test 5.0.5.RELEASE org.springframework spring-webmvc 5.0.5.RELEASE javax.servlet servlet-api 2.5 javax.servlet.jsp jsp-api 2.0 org.mybatis mybatis 3.4.5 org.mybatis mybatis-spring 1.3.1 mysql mysql-connector-java 8.0.26 c3p0 c3p0 0.9.1.2 junit junit 4.12 jstl jstl 1.2 com.fasterxml.jackson.core jackson-core 2.9.0 com.fasterxml.jackson.core jackson-databind 2.9.0 com.fasterxml.jackson.core jackson-annotations 2.9.0 commons-fileupload commons-fileupload 1.3.1 commons-io commons-io 2.3 org.slf4j slf4j-api 1.7.20 ch.qos.logback logback-classic 1.2.3 ch.qos.logback logback-core 1.2.3

第二步我习惯建数据库表，这里我用的是mysql 8.0.26。数据库ssm 表 student

这里id和num都是主键，id是自增的，num作为学号也是主键。

第三步根据数据库表，建立domain包，并建立实体类Student

只对一个表进行增删改查，所以只创建了一个实体类。

package com.wjb.domain; import java.util.Date; public class Student { private int id; private String num; private String name; private String sex; private String birthday; public int getId() { return id; } public void setId(int id) { this.id = id; } public String getNum() { return num; } public void setNum(String num) { this.num = num; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getSex() { return sex; } public void setSex(String sex) { this.sex = sex; } public String getBirthday() { return birthday; } public void setBirthday(String birthday) { this.birthday = birthday; } @Override public String toString() { return "Student{" + "id=" + id + ", num='" + num + '\'' + ", name='" + name + '\'' + ", sex='" + sex + '\'' + ", birthday=" + birthday + '}'; } } 第三步配置文件配置过程在resources下

一、Spring配置文件 ApplicationContext.xml 二、springmvc配置 spring-mvc.xml 三、Mybatis配置文件 sqlMapConfig.xml DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN" "http://mybatis.org/dtd/mybatis-3-config.dtd"> 四、日志配置文件 logback.xml [%level] %blue(%d{HH:mm:ss.SSS}) %cyan([%thread]) %boldGreen(%logger{15}) - %msg %n 五、数据库配置文件抽取 jdbc.properties jdbc.driver=com.mysql.cj.jdbc.Driver #8.0.26驱动 jdbc.url=jdbc:mysql://localhost:3306/ssm jdbc.username=root jdbc.password=root 六、在WEB-INF下配置web.xml contextConfigLocation classpath:applicationContext.xml org.springframework.web.context.ContextLoaderListener DispatcherServlet org.springframework.web.servlet.DispatcherServlet contextConfigLocation classpath:spring-mvc.xml 1 DispatcherServlet / CharacterEncodingFilter org.springframework.web.filter.CharacterEncodingFilter encoding UTF-8 CharacterEncodingFilter /*

第四步项目代码

项目结构

这里面需要用到layui的包，引用了layui的样式和js，需要jQuery的包。

一、前端页面 index.html

在一个数据表格中完成增删改查操作，所以只有一个页面就够了。

DOCTYPE html> 学生信息表 .layertest{ display: none; } 添加学生信息学号八位数学号姓名性别生日立即提交重置学生信息表搜索ID：搜索编辑删除 layui.use('table', function(){ var table = layui.table; var $ = layui.jquery; table.render({ elem: '#test' ,url:'student/findAll' ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板 ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可 title: '提示' ,layEvent: 'LAYTABLE_TIPS' ,icon: 'layui-icon-tips' }] ,title: '用户数据表' ,id: 'test' ,cols: [[ {type: 'checkbox', fixed: 'left'} ,{field:'id', title:'ID', width:320, unresize: true, sort: true} ,{field:'num', title:'学号', width:320, unresize: true, sort: true} ,{field:'name', title:'姓名', width:320, edit: 'text'} ,{field:'sex', title:'性别', width:320, edit: 'text'} ,{field:'birthday', title:'出生日期', width:320,edit: 'text'} ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:200} ]] ,page: false }); $('#reset').on('click', function () { var num = $("#num").val(""); var name = $("#name").val(""); var sex = $("#sex").val(""); var birthday = $("#birthday").val(""); }); $('#add').on('click', function () { var num = $("#num").val(); var name = $("#name").val(); var sex = $("#sex").val(); var birthday = $("#birthday").val(); console.log(num); console.log(name); console.log(sex); console.log(birthday); if (num==undefined||num==''){ console.log('学号不能为空!'); layer.msg('学号不能为空!',function() {time:2000}); return false; } if (name==undefined||name==''){ console.log('姓名不能为空!'); layer.msg('姓名不能为空!',function() {time:2000}); return false; } if (sex==undefined||sex==''){ console.log('性别不能为空!'); layer.msg('性别不能为空!',function() {time:2000}); return false; } if (birthday==undefined||birthday==''){ console.log('生日不能为空!'); layer.msg('生日不能为空!',function() {time:2000}); return false; } $.ajax({ url: "student/add", type: "POST", data: {"num":num,"name":name,sex:sex,birthday:birthday}, success: function (data) { console.log(data); if(data=="ok") {//ok说明登录成功 layer.close(layer.index); layer.msg('添加成功!',function() {time:2000}); $("#num").val(""); $("#name").val(""); $("#sex").val(""); $("#birthday").val(""); table.reload('test',{ url:'student/findAll' , page: { curr:1 } }); } },//响应成功后的回调函数 error: function () { layer.msg('添加失败!',function() {time:2000}); },//表示如果请求响应出现错误，会执行的回调函数 //dataType: "json"//设置接受到的响应数据的格式 }); }); $(document).on('click','#search_btn',function (data) { var search = $('#demoReload'); table.reload('test',{ where:{ num : search.val() }, url:'student/findByNum', page: { curr:1 } }); }); //添加 $(document).on('click','#add_btn',function (data) { layer.open({ type: 1, skin: 'layui-layer-rim', //加上边框 area: ['600px', '450px'], //宽高 content: $('#layertest') }); table.reload('test',{ url:'student/findAll' , page: { curr:1 } }); }); //批量删除 $(document).on('click','#deleteAll_btn',function (data) { var checkStatus = table.checkStatus('test'), data = checkStatus.data, nums = ""; if (data.length > 0) { for (var i in data) { nums += data[i].num + ","; } console.log(nums); layer.confirm('确定删除选中的用户？', {icon: 3, title: '提示信息'}, function (index) { $.ajax({ url: "student/deleteByNum", type: "POST", data: {num: nums}, success: function (msg) { console.log(msg) if (msg == "ok") { layer.msg('删除成功!',function() {time:2000}) table.reload('test',{ url:'student/findAll', page: { curr:1 } }); } else { layer.msg("删除失败", function() {time:2000}); } } }); }); } else { layer.msg("请选择需要删除的用户"); } }); //头工具栏事件 table.on('toolbar(test)', function(obj){ var checkStatus = table.checkStatus(obj.config.id); switch(obj.event){ case 'getCheckData': var data = checkStatus.data; layer.alert(JSON.stringify(data)); break; case 'getCheckLength': var data = checkStatus.data; layer.msg('选中了：'+ data.length + ' 个'); break; case 'isAll': layer.msg(checkStatus.isAll ? '全选': '未全选'); break; //自定义头工具栏右侧图标 - 提示 case 'LAYTABLE_TIPS': layer.alert('这是工具栏右侧自定义的一个图标按钮'); break; }; }); //监听行工具事件 del table.on('tool(test)', function(obj){ var data = obj.data; console.log(obj.data.num); console.log(obj.data.name); console.log(obj.data.sex); console.log(obj.data.birthday); //console.log(obj) if(obj.event === 'del'){ layer.confirm('删除以下信息'+ '学号: '+ data.num+ '姓名: '+ data.name +'性别: ' +data.sex +'出生日期: ' +data.birthday, function(index){ $.ajax({ url: "student/deleteByNum", type: "POST", data: {num: data.num}, success: function (msg) { if (msg == "ok") { //删除这一行 obj.del(); //关闭弹框 layer.close(index); layer.msg('删除成功!',function() {time:2000}) } else { layer.msg("删除失败", function() {time:2000}); } } }); return false; }); } else if(obj.event === 'edit'){ layer.confirm('更改为以下信息'+ '姓名: '+ data.name +'性别: ' +data.sex +'出生日期: ' +data.birthday, function(index){ $.ajax({ url: "student/updateByNum", type: "POST", data: {num: data.num,name: data.name,sex: data.sex,birthday: data.birthday}, success: function (msg) { if (msg == "ok") { //删除这一行 //关闭弹框 layer.close(index); layer.msg('修改成功!',function() {time:2000}) } else { layer.msg("修改失败", function() {time:2000}); } } }); return false; }); } else if(obj.event === 'add'){ layer.open({ type: 1, skin: 'layui-layer-rim', //加上边框 area: ['600px', '450px'], //宽高 content: $('#layertest') }); table.reload('test',{ url:'student/findAll' , page: { curr:1 } }); } }); }); 二、编写controller层，书写对应的方法。

controller层的作用就是接受或返回前端值，和前端进行交互，并且调用service业务层的对象来进行处理。

StudentController.java

package com.wjb.controller; import com.fasterxml.jackson.core.JsonProcessingException; import com.fasterxml.jackson.databind.ObjectMapper; import com.wjb.domain.Student; import com.wjb.service.StudentService; import org.apache.ibatis.annotations.Param; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.http.HttpRequest; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.*; import javax.servlet.http.HttpServletRequest; import java.util.HashMap; import java.util.List; import java.util.Map; @Controller @RequestMapping("/student") //Mapping 中的value值对应前端界面的url @ResponseBody //不进行跳转 public class StudentController { @Autowired private StudentService studentService; //添加学生信息 @RequestMapping(value = "/add",produces = "html/text;",method = {RequestMethod. POST , RequestMethod. GET }) @ResponseBody public String add(Student student){ studentService.add(student); System.out.println(student); System.out.println("添加成功！"); return "ok"; } //修改学生信息 @RequestMapping(value = "/updateByNum",produces = "html/text;charset=UTF-8",method = {RequestMethod. POST , RequestMethod. GET }) @ResponseBody public String updateByNum(Student student){ studentService.updateByNum(student); System.out.println(student); System.out.println("修改成功！"); return "ok"; } @RequestMapping(value = "/deleteByNum",produces = "html/text;charset=UTF-8",method = {RequestMethod. POST , RequestMethod. GET }) @ResponseBody public String deleteByNum(HttpServletRequest request){ String num = request.getParameter("num"); System.out.println(num); String[] nums=num.split(","); //分割id，成一个字符串数组 studentService.deleteByNums(nums); System.out.println("删除成功!"); return "ok"; } //查询学生信息 @GetMapping(value = "/findByNum",produces = "text/html; charset=utf-8") @ResponseBody public String findByNum(HttpServletRequest request) throws JsonProcessingException { String num = request.getParameter("num"); System.out.println(num); List studentList = studentService.findByNum(num); int count1 = studentList.size(); String count = ""+ count1; System.out.println(count); Map result = new HashMap(); //System.out.println(paperslist); result.put("code", 0); result.put("msg", ""); result.put("count",count); result.put("data",studentList); System.out.println(result); ObjectMapper mapper = new ObjectMapper(); String json = mapper.writeValueAsString (result); return json; } //遍历 @GetMapping(value = "/findAll",produces = "text/html; charset=utf-8") @ResponseBody public String findAll() throws JsonProcessingException { List studentList = studentService.findAll(); int count1 = studentList.size(); String count = ""+ count1; Map result = new HashMap(); result.put("code", 0); result.put("msg", ""); result.put("count",count); result.put("data",studentList); System.out.println(result); ObjectMapper mapper = new ObjectMapper(); String json = mapper.writeValueAsString (result); return json; } } 三、编写业务层接口以及接口的实现。

service层是接受controller层的数据，最后交给mapper层处理，执行sql。

在service包下建立StudentService.java,这是一个接口interface

package com.wjb.service; import com.wjb.domain.Student; import java.util.List; public interface StudentService { public void add(Student student); public void updateByNum(Student student); public List findAll(); public List findByNum(String num); public void deleteByNums(String[] nums); }

在service包下建立impl包，在impl下编写对应接口的实现。

StudentServiceImpl.java

package com.wjb.service.impl; import com.wjb.domain.Student; import com.wjb.mapper.StudentMapper; import com.wjb.service.StudentService; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Service; import java.util.List; @Service("studentService") public class StudentServiceImpl implements StudentService { @Autowired private StudentMapper studentMapper; @Override public void add(Student student) { studentMapper.add(student); } @Override public void updateByNum(Student student) { studentMapper.updateByNum(student); } @Override public List findAll() { return studentMapper.findAll(); } @Override public List findByNum(String num) { return studentMapper.findByNum(num); } @Override public void deleteByNums(String[] nums) { studentMapper.deleteByNums(nums); } }

四、编写Mapper层。

这里也是一个接口，这里的mapper会调用xml中的mapper中的SQL。

Student.mapper.java

package com.wjb.mapper; import com.wjb.domain.Student; import org.apache.ibatis.annotations.Param; import java.util.List; public interface StudentMapper { public void add(Student student); public void updateByNum(Student student); public List findAll(); public List findByNum(String num); public void deleteByNums(@Param("nums") String[] nums); } 五、在resources下建立StudentMapper.xml.

创建的路径一定是com\wjb\mapper 这里不能用.

这个xml中对应着增删改查的SQL，其中id对应着mapper层的方法名。

StudentMapper.xml

DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd"> # 返回自增主键id insert into student values(#{id},#{num},#{name},#{sex},#{birthday}) update student set name = #{name}, sex = #{sex}, birthday = #{birthday} where num = #{num} select * from student select * from student where num=#{num} delete from student where num in #{num} ;

第五步，运行展示

目前功能只有简单的增删改查，不过用到了ajax的异步局部刷新，并且有批量删除功能。因为这是第一次整合ssm框架，肯定存在着很多不足，需要大佬指点指点，如果需要相关文件的可以私聊我，记得点个赞哦！

【本文地址】

公司简介

联系我们